<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<script>
		function imgOver(){
			document.getElementById("enter").src="./asset/img/enter_over.png";
		}
		function imgOut(){
			document.getElementById("enter").src="./asset/img/enter_out.png";
		}
	</script>
	<title>太正浪漫資料館</title>
	<style>
		#canvas{
			position: fixed;
			width: 100%;
			height: 100%;
			z-index: -1;
		}
		.welcomeImage,.welcomeLogo{
			justify-content: center;
			text-align: center;
		}
		@media only screen and (min-width: 768px){
			.welcomeImage{
				width:650px;
				position: fixed;
				top: 10%;
				left: 20px
			}
			.welcomeLogo{
				height:10%;
				position: fixed;
				left:40%;
				top:45%
			}
			.enter{
				width:30%
			}
		}
		@media only screen and (max-width: 768px){
			.welcomeImage{
				width:100%;
				position: fixed;
				top:210px
			}
			.welcomeLogo{
				width:100%;
				position: fixed;
				top:130px;
				left:2.5%
			}
			.enter{
				width:40%
			}
		}
	</style>
</head>
<body>
<script src="top.js"></script>
	<canvas id="canvas" width="100%" height="100%"></canvas>
		<div class="welcomeImage">
			<img src="asset/img/sakura_home.png" width="100%">
		</div>
		<div class="welcomeLogo">
			<img class="logoMonji" src="asset/img/logo-monji.png" width="95%"><!--<br><br><br>
			<a href="home.html">
				<img class="enter" id="enter" onmouseover="imgOver()" onmouseout="imgOut()" src="asset/img/enter_out.png">
			</a>//-->
		</div>
	<script src="./js/jquery-1.11.1.min.js"></script>
	<script async="" src="./js/fallen.js"></script>
</body>
</html>
